<!DOCTYPE html>
<html>
<head>
<title>Satellite Control Center - Astrium - Log Monitoring</title>
<meta charset="utf-8">
<link rel="stylesheet"
	href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script
	src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
<script type="text/javascript" src="verification.js"></script>
<script src="/AMRA-SCC/MobilityAccess/WebContent/WEB-INF/addTemplate.js"></script>
<link rel="stylesheet" href="style-table.css" />
<script LANGUAGE="JavaScript">
        function redirect(path) {
                document.location.href=path;   
        }
      </script>
<script type="text/javascript">
	  function logs()
	  {
	     setInterval(function(){
                $.getJSON( "log.json", function( data ) {
			var tab = new Array;
                        var i=1;
			tab[0] = "<table><thead class='ui-btn-active ui-state-persist'><tr><th >Date</th><th>Heure</th> <th>Level</th><th>Application</th><th>Message</th></tr></thead><tbody>";
                        $.each( data, function( key, val ) {
				 $.each( val, function( key2, val2 ) {
                        	 tab[i] = "<tr><td>" + val2.date + "</td><td>" + val2.heure + "</td><td>" + val2.level + "</td><td>" + val2.appli + "</td><td>" + val2.message + "</td></tr>";
				i++;
				});
			});
			tab[i++] = "</tbody><tfoot><tr><td colspan='6'><span><BR /></span></td></tr></tfoot></table>";
			$("#logs").html(tab);
                });
             }, 30000);
           }

        </script>
</head>
<body onLoad="logs()">
	<div data-role="page" id="page-1">
		<div id="panel-wrapper"></div>
		<div id="page-wrapper">
			<div data-role="header" id="header"></div>
			<div id="content-wrapper">
				<div data-role="navbar" id="navbar">
					<ul>
						<li><a href="../FOPViewer/index.html"
							data-transition="slidedown" rel="external">FOP Viewer</a></li>
						<li><a href="#" data-transition="none" class="ui-btn-active">Log
								Monitoring</a></li>
						<li><a href="../TMViewer/index.html"
							data-transition="slidedown" rel="external">TM Viewer</a></li>
					</ul>
				</div>
				<div data-role="content" id="content">
					<p class="config">
						<input type="button" onClick="redirect('config.html')"
							data-icon="gear" data-iconpos="right" value="Configuration">
					</p>

					<p class="config">
						<select id="select">
							<option selected value="1">Date</option>
							<option value="2">Heure</option>
							<option value="3">Level</option>
							<option value="4">Application</option>
						</select>
					</p>

					<input type="search" placeholder="Filter logs" id="filter" />
					<div id="logs">
						<table>
							<thead class="ui-btn-active ui-state-persist">
								<tr>
									<th>Date</th>
									<th>Heure</th>
									<th>Level</th>
									<th>Application</th>
									<th>Message</th>
									</th>
							</thead>
							<tbody>
							</tbody>
							</div>
							<tfoot>
								<tr>
									<td colspan="6"><span><BR /></span></td>
								</tr>
							</tfoot>
						</table>
					</div>
				</div>
			</div>
			<footer data-role="footer" id="footer" data-position="fixed">
			</footer>
		</div>
	</div>
</body>

</html>
